<template>
  <div class="app-container">
    <div>
      <el-form :inline="true" :model="form" class="demo-form-inline" @submit.native.prevent>
        <el-form-item label="账号:">
          <el-input v-model="form.user_name" clearable placeholder="请输入账号"></el-input>
        </el-form-item>
        <!-- <el-form-item label="商户号:">
          <el-input v-model="form.merchantNo" clearable placeholder="请输入商户号"></el-input>
        </el-form-item> -->
        <el-form-item>
          <el-button type="primary" style="margin-left: 10px" @click="getlistdata(true)" icon="el-icon-search">搜索</el-button>
        </el-form-item>
      </el-form>
    </div>
    <el-table v-loading="listLoading" :data="list" element-loading-text="Loading" border fit header-cell-class-name="tableheader">
      <el-table-column align="center" label="账号">
        <template slot-scope="scope">
          {{ scope.row.userName }}
        </template>
      </el-table-column>
      <el-table-column align="center" label="姓名">
        <template slot-scope="scope">
          {{ scope.row.name }}
        </template>
      </el-table-column>
      <el-table-column align="center" label="申请单号">
        <template slot-scope="scope">
          {{ scope.row.applyment_id }}
        </template>
      </el-table-column>
      <el-table-column align="center" label="商户号">
        <template slot-scope="scope">
          {{ scope.row.sub_mchid }}
        </template>
      </el-table-column>
      <el-table-column align="center" label="申请时间">
        <template slot-scope="scope">
          {{ scope.row.applyment_time }}
        </template>
      </el-table-column>
      <el-table-column align="center" label="申请状态">
        <template slot-scope="scope">
          {{ scope.row.applyment_state_str }}
        </template>
      </el-table-column>
			<el-table-column align="center" label="申请状态描述">
        <template slot-scope="scope">
          {{ scope.row.applyment_state_msg }}
        </template>
      </el-table-column>
      <el-table-column align="center" label="操作">
        <template slot-scope="scope">
          <el-button type="danger" size="mini" plain @click="delbtn(scope.row)" icon="el-icon-delete">作废</el-button>
        </template>
      </el-table-column>
    </el-table>
    <div class="pagination">
      <el-pagination style="text-align: center" layout="prev, pager, next" small :current-page="form.page" :page-size="form.pagesize" :total="total" @size-change="handleSizeChange"
        @current-change="handleCurrentChange" />
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      form: {
        isPage: true,
				page: 1,
				pagesize: 15,
				issale: true,
				serchKeyword: "",
				user_name: ""
      },
      list: [],
      total: 0,
      listLoading: true,
    }
  },
  created() {
    this.getlistdata()
  },
  methods: {
    //   查询提交
    getlistdata(isquery) {
      this.listLoading = true
      if (isquery === true) {
        this.form.page = 1
      }
      this.$post(this.$api + '/wx_merchant/get_wx_merchant_list', this.form).then((res) => {
        this.listLoading = false
        if (res.code === 0) {
          this.list = res.rows
          this.total = res.total
        } else {
          this.$notify({
            title: '失败',
            message: res.msg,
            type: 'error',
          })
        }
      })
    },

    delbtn(item) {
			console.log(item);
      this.$confirm('确认作废?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning',
      }).then(() => {
        this.listLoading = true
        this.$get(this.$api + '/wx_merchant/wx_merchant_canceled?baseuserid=' + item.baseuserid).then((res) => {
          this.listLoading = false
          if (res.code === 0) {
            this.getlistdata()
            this.$notify({
              title: '成功',
              message: res.msg,
              type: 'success',
            })
          } else {
            this.$notify({
              title: '失败',
              message: res.msg,
              type: 'error',
            })
          }
        })
      })
    },
    handleSizeChange(v) {
      this.form.pagesize = v
      this.getlistdata()
    },
    handleCurrentChange(v) {
      this.form.page = v
      this.getlistdata()
    },
  },
}
</script>
